<template>

  <!-- el-dropdown
               默认插槽：默认显示内容
               具名插槽：dropdown
                 el-dropdown-menu
                    el-dropdown-item
     -->
  <el-dropdown>
    <svg-icon class="svg" icon-class="language" />
    <template #dropdown>
      <el-dropdown-menu>
        <!-- zh -->
        <el-dropdown-item :disabled="$i18n.locale==='zh'" @click.native="changeLang('zh')">中文</el-dropdown-item>
        <!-- en -->
        <el-dropdown-item :disabled="$i18n.locale==='en'" @click.native="changeLang('en')">en</el-dropdown-item>
      </el-dropdown-menu>
    </template>
  </el-dropdown>

</template>
<script>
import jsCookie from 'js-cookie'
export default {
  name: 'HmLang',
  methods: {
    changeLang(code) {
      this.$i18n.locale = code
      // 刷新页面
      this.$router.go(0) // -1后退  0刷新    1前进
      jsCookie.set('lang', code)
    }
  }
}
</script>
<style lang="scss" scoped>
.svg{
    font-size: 18px;
    color: #fff;
}
</style>
